<template>
    <div style="width:100%;height:100%">
      <Layout style="height:100%">
        <!-- PC 导航 -->
        <Sider style="height:100%;background:#f5f7f9" id="lse_api_pc_menu">
          <Menu active-name="1" width="auto" style="height:100%" @on-select="handleSelect">
              <MenuItem name="3" id="guide_menu_user">
                <el-avatar v-if="userInfo.portraitUrl" :src="userInfo.portraitUrl"></el-avatar>
                <el-avatar v-else>{{userInfo.nickname.substring(0,1)}}</el-avatar>
              <!-- eslint-disable-next-line vue/no-parsing-error -->
              </MenuItem>
              <MenuItem name="1" id="guide_menu_project">
              <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1154 1024" width="20" height="20" t="1591164838448" p-id="9228" version="1.1"><path fill="#2c2c2c" d="M 112.923 477.38 a 57.0608 57.0608 0 0 1 40.5896 -16.5583 a 58.2808 58.2808 0 0 1 41.1779 16.5583 c 10.6322 11.0897 16.5583 25.8179 16.5583 41.1779 a 57.8015 57.8015 0 0 1 -98.6744 40.8075 a 57.954 57.954 0 0 1 0.348596 -81.9854 m 0 -280.402 a 57.2351 57.2351 0 0 1 40.5896 -16.5583 a 58.5423 58.5423 0 0 1 41.1779 16.5583 a 59.4791 59.4791 0 0 1 16.5583 41.1779 a 57.8233 57.8233 0 0 1 -98.6962 40.8293 a 57.9758 57.9758 0 0 1 0.370383 -82.0071 m 216.347 -16.5583 h 421.714 a 57.7362 57.7362 0 0 1 0 115.472 H 329.554 a 57.7362 57.7362 0 0 1 -0.305021 -115.472 m 316.874 676.232 H 156.04 c -33.2473 -0.130723 -59.8495 -25.905 -59.9803 -57.7362 c 0.065362 -31.6351 26.6458 -57.344 59.6752 -57.7362 h 462.412 c -0.108936 -3.26809 -0.501106 -6.44902 -0.501106 -9.76068 c 0 -57.0608 16.6019 -110.134 44.8381 -155.125 h -332.909 a 57.7362 57.7362 0 0 1 -0.326808 -115.472 H 751.006 c 10.7847 0 20.3493 3.7474 28.977 8.91098 a 290.86 290.86 0 0 1 130.288 -30.8943 V 66.3857 A 66.4075 66.4075 0 0 0 843.82 0 H 66.3857 A 66.4075 66.4075 0 0 0 0 66.3857 v 891.229 A 66.3857 66.3857 0 0 0 66.3857 1024 H 843.82 c 7.5166 0 14.5974 -1.52511 21.3515 -3.83455 a 292.341 292.341 0 0 1 -219.049 -163.513" p-id="9229" /><path fill="#2c2c2c" d="M 1081.13 746.474 l -162.969 92.2036 a 16.1226 16.1226 0 0 1 -8.12664 2.13515 a 16.0354 16.0354 0 0 1 -8.08306 -2.13515 l -162.969 -92.2036 a 16.4494 16.4494 0 1 1 16.1879 -28.6284 l 154.864 87.6065 l 154.885 -87.6065 a 16.4494 16.4494 0 1 1 16.2097 28.6284 m 0 61.4618 l -162.969 92.2036 a 16.3404 16.3404 0 0 1 -16.2097 0 l -162.969 -92.2036 a 16.4494 16.4494 0 1 1 16.1879 -28.6502 l 154.864 87.6283 l 154.885 -87.6283 a 16.4494 16.4494 0 1 1 16.2097 28.6502 m -342.713 -152.532 l 162.969 -92.1818 a 17.6041 17.6041 0 0 1 17.3209 0 l 162.969 92.1818 a 17.5605 17.5605 0 0 1 0 30.5893 l -162.969 92.1818 a 17.4298 17.4298 0 0 1 -17.2991 0 l -162.969 -92.16 a 17.5387 17.5387 0 0 1 0 -30.6111 m 171.596 -167.587 c -134.645 0 -243.799 109.132 -243.799 243.799 c 0 134.645 109.154 243.799 243.799 243.799 S 1153.85 866.26 1153.85 731.615 c 0 -134.667 -109.154 -243.799 -243.799 -243.799" p-id="9230" /></svg>
              &nbsp;项目
              </div>
              <!-- eslint-disable-next-line vue/no-parsing-error -->
              </MenuItem>
              <MenuItem name="2" id="guide_menu_group">
              <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1024 1024" width="20" height="20" t="1591164947150" p-id="13035" version="1.1"><path fill="#2c2c2c" d="M 265.646 435.389 l 224.445 105.713 V 292.869 L 265.646 189.629 v 245.76 Z m 266.726 -140.047 v 246.072 l 221.507 -103.235 V 191.201 l -221.507 104.095 v 0.04608 Z m -19.5328 -235.11 l -218.522 100.408 l 218.614 100.403 l 215.588 -100.403 l -215.68 -100.408 Z M 0 857.743 l 224.394 105.708 v -248.228 L 0 611.978 v 245.765 Z m 266.675 -140.052 v 246.072 l 221.507 -103.24 v -246.973 l -221.507 104.141 Z M 247.194 482.586 L 28.5747 582.994 l 218.619 100.408 l 215.629 -100.408 L 247.194 482.586 Z m 288.625 375.153 l 224.394 105.713 v -248.228 l -224.394 -103.24 v 245.755 Z m 266.721 -140.047 v 246.072 L 1024 860.529 v -246.973 l -221.46 104.136 Z m -19.5738 -235.105 l -218.522 100.408 l 218.568 100.403 l 215.634 -100.403 l -215.629 -100.408 h -0.0512 Z" p-id="13036" /></svg>
                &nbsp;项目组
              </div>
              <!-- eslint-disable-next-line vue/no-parsing-error -->
              </MenuItem>
              <MenuItem name="4" id="guide_menu_onlineTest">
              <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1097 1024" width="20" height="20" t="1591164421861" p-id="2294" version="1.1"><path d="M 612.498 762.587 v 113.445 h 253.879 a 42.5691 42.5691 0 0 1 0 85.1383 H 264.923 a 42.5691 42.5691 0 0 1 0 -85.1383 h 253.952 v -113.445 H 165.157 A 113.957 113.957 0 0 1 50.7611 649.07 V 138.386 c 0 -62.6834 51.2 -113.445 114.395 -113.445 H 966.217 c 63.2686 0 114.469 50.7611 114.469 113.445 v 510.683 c 0 62.6834 -51.2 113.518 -114.469 113.518 H 612.498 Z M 197.047 471.04 H 362.057 l 35.2549 87.9177 c 9.50857 23.7714 43.4469 23.9177 53.1017 0.146286 l 111.835 -275.017 l 81.7737 170.789 a 28.5989 28.5989 0 0 0 25.8194 16.1646 h 277.723 a 28.5257 28.5257 0 0 0 28.672 -28.3794 a 28.5257 28.5257 0 0 0 -28.672 -28.3063 h -259.657 L 585.874 201.289 a 28.672 28.672 0 0 0 -52.3703 1.46286 L 424.009 472.21 l -16.0183 -39.936 a 28.5989 28.5989 0 0 0 -26.5509 -17.8469 h -184.32 a 28.5257 28.5257 0 0 0 -28.5989 28.3063 a 28.5257 28.5257 0 0 0 28.5257 28.3794 Z" p-id="2295" /></svg>
                &nbsp;在线调试
              </div>
              <!-- eslint-disable-next-line vue/no-parsing-error -->
              </MenuItem>
              <MenuItem name="5" id="guide_menu_formatting">
              <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1344 1024" width="20" height="20" t="1594280152052" p-id="2111" version="1.1"><path fill="#2c2c2c" d="M 1331.97 482.112 L 1036.16 183.488 a 41.6 41.6 0 0 0 -60.032 0 a 42.56 42.56 0 0 0 0 60.544 L 1242.43 512 l -266.24 268.8 a 42.56 42.56 0 0 0 0 60.608 a 40.704 40.704 0 0 0 59.136 0 l 295.744 -298.688 a 43.328 43.328 0 0 0 0.896 -60.608 Z M 369.536 183.488 a 41.6 41.6 0 0 0 -59.968 0 L 13.824 482.112 a 42.56 42.56 0 0 0 0 60.608 l 295.68 298.688 c 8.512 7.68 19.456 11.904 30.464 11.904 a 39.424 39.424 0 0 0 29.568 -12.8 a 42.56 42.56 0 0 0 0 -60.544 L 103.36 512 l 266.24 -268.8 a 43.072 43.072 0 0 0 0 -59.712 Z m 441.088 -181.76 a 41.408 41.408 0 0 0 -51.456 29.568 L 505.6 970.24 c -5.952 23.04 6.72 46.08 29.568 52.032 a 49.024 49.024 0 0 0 10.944 1.728 c 18.56 0 35.52 -12.8 40.576 -31.552 L 840.128 53.76 a 42.24 42.24 0 0 0 -29.248 -51.968 l -0.256 -0.064 Z" p-id="2112" /></svg>
                &nbsp;数据格式化
              </div>
              <!-- eslint-disable-next-line vue/no-parsing-error -->
              </MenuItem>
          </Menu>
        </Sider>
        <!-- 主体内容 -->
        <Layout style="height:100%">
            <Content style="height:calc(100% - 40px)">
              <Row  :style="per" style="height:100%">
                <Col :xs="{span:24}" :sm="{span:22,offset:1}" :md="{span:20,offset:2}">
                  <el-scrollbar style="height:100%" >
                    <div style="padding:10px;height:100%">
                      <!-- 项目 tab -->
                      <transition name="el-fade-in">
                        <div v-show="tabIndex === 1" id="projectContent">
                          <Divider orientation="left">项目列表
                            <el-button type="text" icon="el-icon-refresh" @click="getProjectList(1)"></el-button>
                          </Divider>
                          <!-- 项目操作 -->
                          <div style="text-align:right">
                            <el-button size="mini" icon="el-icon-plus" @click="pubilcDrawer = true;pubilcDrawerTitle='创建项目';pubilcDrawerType='createProject'">
                                          <span class="tips">创建项目</span>
                            </el-button>
                          </div>
                          <!-- 项目内容 -->
                          <waterfall :col="waterfallCol" :data="project.list" style="margin:10px 0" v-show="project.list.length !== 0">
                            <template>
                              <el-card class="waterfall-item" v-for="(item,index) in project.list" :key="index" :body-style="{cursor:'pointer'}" @click.native="projectApi.projectId = item.id;projectInfo.name=item.projectName;
                                projectApi.selectApiList = [];getProjectApiList(1);getApiCreateList(1);filterApi.name = '';filterApi.selectCreate = [];filterApi.selectMethod = [];filterApi.flag=false">
                                <div slot="header" class="clearfix">
                                  <b>{{item.projectName}}</b>
                                </div>
                                <div>
                                  <div class="text item" >{{item.projectInfo ? item.projectInfo : '暂无简介'}}</div>
                                  <div class="bottom clearfix">
                                    <div class="tips">
                                    <Time :time="item.createTime"/>&nbsp;创建
                                    </div>
                                  </div>
                                </div>
                                <div>
                                  <el-button size="mini" style="width:100%;margin-top:10px"
                                  @click.stop="projectApi.projectId = item.id;projectInfo.name=item.projectName;
                                projectApi.selectApiList = [];pubilcDrawer = true;pubilcDrawerTitle=item.projectName+'的项目日志';pubilcDrawerType='projectLog';getLogs(1)">项目日志</el-button>
                                </div>
                              </el-card>
                            </template>
                          </waterfall>
                          <!-- 分页 -->
                          <el-pagination style="margin:20px 0;white-space: normal;"
                            @current-change="getProjectList"
                            :current-page.sync="project.pageNo"
                            background
                            :page-size="pageSize"
                            layout="prev, next"
                            :total="project.total" v-if="project.list.length !== 0">
                          </el-pagination>
                          <div  v-show="project.list.length === 0">
                            <img :src="notData" draggable="false">
                            <div style="font-size:12px">暂无项目</div>
                          </div>
                        </div>
                      </transition>
                      <!-- 项目组 tab -->
                      <transition name="el-fade-in">
                        <div v-show="tabIndex === 2">
                          <!-- 操作 -->
                          <div style="text-align:right;margin-bottom:10px">
                            <el-button size="mini" icon="el-icon-search" @click="pubilcDrawer = true;pubilcDrawerTitle='查找项目组';pubilcDrawerType='findGroup'">
                                          <span class="tips">查找项目组</span>
                            </el-button>
                            <el-button size="mini" icon="el-icon-plus" @click="pubilcDrawer = true;pubilcDrawerTitle='创建项目组';pubilcDrawerType='createGroup'">
                                          <span class="tips">创建项目组</span>
                            </el-button>
                          </div>
                          <!-- 内容 -->
                          <Tabs v-model="group.selected" type="card" tab-position="top" closable @on-tab-remove="groupTabRemove" @on-click="groupTabClick">
                            <TabPane  name="group" label="项目组" :closable="false">
                              <!-- 我创建的项目组 -->
                              <Divider orientation="left">我创建的项目组
                                <el-button type="text" icon="el-icon-refresh" @click="getGroupListByMe(1)"></el-button>
                              </Divider>
                                <div id="groupByMe" v-loading="group.listMeLoadingFlag">
                                <waterfall :col="waterfallCol" :data="group.listMe" style="margin:10px 0" v-show="group.listMe.length !== 0">
                                  <template>
                                    <el-card class="waterfall-item" v-for="(item,index) in group.listMe" :key="index" :body-style="{cursor:'pointer'}" @click.native="selectedGroups(item)">
                                      <div slot="header" class="clearfix">
                                        <b>{{item.groupName}}</b>
                                      </div>
                                      <div>
                                        <div class="text item" >{{item.groupInfo ? item.groupInfo : '暂无简介'}}</div>
                                        <div class="bottom clearfix">
                                          <div class="tips">
                                          <Time :time="item.createTime"/>&nbsp;创建
                                          </div>
                                        </div>
                                      </div>
                                    </el-card>
                                  </template>
                                </waterfall>
                                <!-- 分页 -->
                                <el-pagination style="margin:20px 0;white-space: normal;"
                                  @current-change="getGroupListByMe"
                                  :current-page.sync="group.pageNoMe"
                                  background
                                  :page-size="pageSize"
                                  layout="prev, next"
                                  :total="group.totalMe" v-if="group.listMe.length !== 0">
                                </el-pagination>
                                <div  v-show="group.listMe.length === 0">
                                  <img :src="notData" draggable="false">
                                  <div style="font-size:12px">暂未创建项目组</div>
                                </div>
                                </div>
                                <!-- 我加入的项目组 -->
                              <Divider orientation="left">我加入的项目组
                                <el-button type="text" icon="el-icon-refresh" @click="getGroupListByJoin(1)"></el-button>
                                </Divider>
                                <div id="groupByJoin" v-loading="group.listJoinLoadingFlag">
                                <waterfall :col="waterfallCol" :data="group.listJoin" style="margin:10px 0" v-show="group.listJoin.length !== 0">
                                  <template>
                                    <el-card class="waterfall-item" v-for="(item,index) in group.listJoin" :key="index" :body-style="{cursor:'pointer'}" @click.native="selectedGroups(item)">
                                      <div slot="header" class="clearfix">
                                        <b>{{item.groupName}}</b>
                                      </div>
                                      <div >
                                        <div class="text item" >{{item.groupInfo ? item.groupInfo : '暂无简介'}}</div>
                                        <div class="bottom clearfix">
                                          <div class="tips">
                                          <Time :time="item.createTime"/>&nbsp;创建
                                          </div>
                                        </div>
                                      </div>
                                    </el-card>
                                  </template>
                                </waterfall>
                                <!-- 分页 -->
                                <el-pagination style="margin:20px 0;white-space: normal;"
                                  @current-change="getGroupListByJoin"
                                  :current-page.sync="group.pageJoin"
                                  background
                                  :page-size="pageSize"
                                  layout="prev, next"
                                  :total="group.totalJoin" v-if="group.listJoin.length !== 0">
                                </el-pagination>
                                <div  v-show="group.listJoin.length === 0">
                                  <img :src="notData" draggable="false">
                                  <div style="font-size:12px">暂未加入项目组</div>
                                </div>
                                </div>
                            </TabPane>
                            <!-- 选中的项目组 -->
                            <TabPane v-for="(item, i) in selectedGroup" :key="i" :name="item.groupName+'_'+i+'_'+item.id" :label="item.groupName">
                              <!-- 操作 -->
                              <div style="text-align:right">
                                <el-button size="mini" icon="el-icon-tickets" @click="pubilcDrawer = true;pubilcDrawerTitle='选择项目';pubilcDrawerType='selectProject'">
                                          <span class="tips">迁移项目</span>
                                </el-button>
                                <el-button size="mini" icon="el-icon-user-solid" @click="pubilcDrawer = true;pubilcDrawerTitle='组成员';pubilcDrawerType='groupUser';getUserListByGroup(1)">
                                          <span class="tips">组成员</span>
                                </el-button>
                                <Dropdown trigger="click" style="margin-left:10px;" placement="left-start">
                                  <el-button size="mini" icon="el-icon-more">
                                      <span class="tips">更多</span>
                                  </el-button>
                                  <DropdownMenu slot="list" style="text-align:center">
                                      <DropdownItem>
                                        <div @click="getGroupShareKey">
                                          <Icon type="md-share" />
                                          <span class="tips">分享</span>
                                        </div>
                                      </DropdownItem>
                                      <DropdownItem>
                                        <div @click="pubilcDrawer = true;pubilcDrawerTitle='项目组申请';pubilcDrawerType='groupUserAudit';getAuditListByGroup(1);groupUserAudit.list=[]">
                                        <Icon type="md-list-box" />
                                          <span class="tips">申请记录</span>
                                        </div>
                                      </DropdownItem>
                                      <DropdownItem>
                                        <div @click="getGroupSale">
                                          <Icon type="md-key" />
                                          <span class="tips">项目组密钥</span>
                                        </div>
                                      </DropdownItem>
                                      <el-popconfirm
                                          title="确认解散此项目组?"
                                          @onConfirm="dissolveGroup"
                                        >
                                        <DropdownItem  slot="reference">
                                          <Icon type="md-trash"/>
                                          <span class="tips">解散项目组</span>
                                        </DropdownItem>
                                      </el-popconfirm>
                                  </DropdownMenu>
                                </Dropdown>
                                <el-button size="mini" style="margin-left:10px;margin-top:10px" @click="groupInfoProject.groupId = item.id;getProjectListByGroup()" icon="el-icon-refresh">
                                      <span class="tips">刷新</span>
                                </el-button>
                              </div>
                              <!-- 项目内容 -->
                              <waterfall :col="waterfallCol - 1" :data="groupInfoProject.list" style="margin:10px 0" v-show="groupInfoProject.list.length !== 0">
                                <template>
                                  <el-card class="waterfall-item" v-for="(item,index) in groupInfoProject.list" :key="index" :body-style="{cursor:'pointer'}" @click.native="projectApi.projectId = item.id;projectInfo.name=item.projectName;
                                    projectApi.selectApiList = [];getProjectApiList(1);getApiCreateList(1);filterApi.name = '';filterApi.selectCreate = [];filterApi.selectMethod = [];filterApi.flag=false">
                                    <div slot="header" class="clearfix">
                                      <b>{{item.projectName}}</b>
                                    </div>
                                    <div>
                                      <div class="text item" >{{item.projectInfo ? item.projectInfo : '暂无简介'}}
                                      </div>
                                    </div>
                                    <div class="bottom clearfix">
                                      <div class="tips">
                                      <Time :time="item.createTime"/>&nbsp;创建
                                      </div>
                                      <div style="margin-top:10px">
                                      <el-popconfirm
                                        title="确认迁出此项目?此操作不可逆"
                                        @onConfirm="projectOutGroup(item.id)"
                                      >
                                        <el-button size="mini" @click.stop slot="reference" style="width:calc(50% - 10px);">迁出</el-button>
                                      </el-popconfirm>
                                        <el-button size="mini" style="width:calc(50% - 10px);"
                                        @click.stop="projectApi.projectId = item.id;projectInfo.name=item.projectName;
                                      projectApi.selectApiList = [];pubilcDrawer = true;pubilcDrawerTitle=item.projectName+'的项目日志';pubilcDrawerType='projectLog';getLogs(1)">项目日志</el-button>
                                      </div>
                                      <div style="text-align:left;margin-top:5px" class="time">创建者: {{item.userInfo.nickname}}</div>
                                    </div>
                                  </el-card>
                                </template>
                              </waterfall>
                              <div  v-show="groupInfoProject.list.length === 0">
                                <img :src="notData" draggable="false">
                                  <div style="font-size:12px">暂无项目</div>
                              </div>
                            </TabPane>
                          </Tabs>
                        </div>
                      </transition>
                      <!-- 个人中心 -->
                      <transition name="el-fade-in">
                        <div v-show="tabIndex === 3">
                          <Tabs size="small">
                            <TabPane label="个人中心">
                              <USERHOME :userInfo="userInfo" :statistical="statistical" :statisticalLoading="statisticalLoading"></USERHOME>
                            </TabPane>
                            <TabPane label="网站信息">
                              <WEBINFO></WEBINFO>
                            </TabPane>
                          </Tabs>
                        </div>
                      </transition>
                      <!-- 在线调试 -->
                      <transition name="el-fade-in">
                        <div v-show="tabIndex === 4" style="height:100%">
                          <INTERFACE></INTERFACE>
                        </div>
                      </transition>
                      <!-- 数据格式化 -->
                      <transition name="el-fade-in">
                        <div v-show="tabIndex === 5" style="height:100%">
                          <DATAVIEW :showFlag="true" :isMenuControl="true"></DATAVIEW>
                        </div>
                      </transition>
                    </div>
                  </el-scrollbar>
                </Col>
              </Row>
            </Content>
            <Footer style="padding: 10px 5px">
              <div class="tips">Copyright @ {{getYear()}} LSE | 蜀ICP备20021206号-1</div>
            </Footer>
        </Layout>
    </Layout>
    <!-- 移动端导航 -->
    <div id="lse_api_mobile_menu">
      <List border style="background: white;">
        <ListItem style="padding:10px">
          <Dropdown trigger="click" placement="left-end">
            <Icon type="ios-more" size="25"/>
            <DropdownMenu slot="list" style="min-width:auto">
                <DropdownItem @click.native="handleSelect(1)">
                  <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1154 1024" width="15" height="15" t="1591164838448" p-id="9228" version="1.1"><path fill="#2c2c2c" d="M 112.923 477.38 a 57.0608 57.0608 0 0 1 40.5896 -16.5583 a 58.2808 58.2808 0 0 1 41.1779 16.5583 c 10.6322 11.0897 16.5583 25.8179 16.5583 41.1779 a 57.8015 57.8015 0 0 1 -98.6744 40.8075 a 57.954 57.954 0 0 1 0.348596 -81.9854 m 0 -280.402 a 57.2351 57.2351 0 0 1 40.5896 -16.5583 a 58.5423 58.5423 0 0 1 41.1779 16.5583 a 59.4791 59.4791 0 0 1 16.5583 41.1779 a 57.8233 57.8233 0 0 1 -98.6962 40.8293 a 57.9758 57.9758 0 0 1 0.370383 -82.0071 m 216.347 -16.5583 h 421.714 a 57.7362 57.7362 0 0 1 0 115.472 H 329.554 a 57.7362 57.7362 0 0 1 -0.305021 -115.472 m 316.874 676.232 H 156.04 c -33.2473 -0.130723 -59.8495 -25.905 -59.9803 -57.7362 c 0.065362 -31.6351 26.6458 -57.344 59.6752 -57.7362 h 462.412 c -0.108936 -3.26809 -0.501106 -6.44902 -0.501106 -9.76068 c 0 -57.0608 16.6019 -110.134 44.8381 -155.125 h -332.909 a 57.7362 57.7362 0 0 1 -0.326808 -115.472 H 751.006 c 10.7847 0 20.3493 3.7474 28.977 8.91098 a 290.86 290.86 0 0 1 130.288 -30.8943 V 66.3857 A 66.4075 66.4075 0 0 0 843.82 0 H 66.3857 A 66.4075 66.4075 0 0 0 0 66.3857 v 891.229 A 66.3857 66.3857 0 0 0 66.3857 1024 H 843.82 c 7.5166 0 14.5974 -1.52511 21.3515 -3.83455 a 292.341 292.341 0 0 1 -219.049 -163.513" p-id="9229" /><path fill="#2c2c2c" d="M 1081.13 746.474 l -162.969 92.2036 a 16.1226 16.1226 0 0 1 -8.12664 2.13515 a 16.0354 16.0354 0 0 1 -8.08306 -2.13515 l -162.969 -92.2036 a 16.4494 16.4494 0 1 1 16.1879 -28.6284 l 154.864 87.6065 l 154.885 -87.6065 a 16.4494 16.4494 0 1 1 16.2097 28.6284 m 0 61.4618 l -162.969 92.2036 a 16.3404 16.3404 0 0 1 -16.2097 0 l -162.969 -92.2036 a 16.4494 16.4494 0 1 1 16.1879 -28.6502 l 154.864 87.6283 l 154.885 -87.6283 a 16.4494 16.4494 0 1 1 16.2097 28.6502 m -342.713 -152.532 l 162.969 -92.1818 a 17.6041 17.6041 0 0 1 17.3209 0 l 162.969 92.1818 a 17.5605 17.5605 0 0 1 0 30.5893 l -162.969 92.1818 a 17.4298 17.4298 0 0 1 -17.2991 0 l -162.969 -92.16 a 17.5387 17.5387 0 0 1 0 -30.6111 m 171.596 -167.587 c -134.645 0 -243.799 109.132 -243.799 243.799 c 0 134.645 109.154 243.799 243.799 243.799 S 1153.85 866.26 1153.85 731.615 c 0 -134.667 -109.154 -243.799 -243.799 -243.799" p-id="9230" /></svg>
                  &nbsp;项目
                  </div>
                </DropdownItem>
                <DropdownItem @click.native="handleSelect(2)">
                  <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1024 1024" width="15" height="15" t="1591164947150" p-id="13035" version="1.1"><path fill="#2c2c2c" d="M 265.646 435.389 l 224.445 105.713 V 292.869 L 265.646 189.629 v 245.76 Z m 266.726 -140.047 v 246.072 l 221.507 -103.235 V 191.201 l -221.507 104.095 v 0.04608 Z m -19.5328 -235.11 l -218.522 100.408 l 218.614 100.403 l 215.588 -100.403 l -215.68 -100.408 Z M 0 857.743 l 224.394 105.708 v -248.228 L 0 611.978 v 245.765 Z m 266.675 -140.052 v 246.072 l 221.507 -103.24 v -246.973 l -221.507 104.141 Z M 247.194 482.586 L 28.5747 582.994 l 218.619 100.408 l 215.629 -100.408 L 247.194 482.586 Z m 288.625 375.153 l 224.394 105.713 v -248.228 l -224.394 -103.24 v 245.755 Z m 266.721 -140.047 v 246.072 L 1024 860.529 v -246.973 l -221.46 104.136 Z m -19.5738 -235.105 l -218.522 100.408 l 218.568 100.403 l 215.634 -100.403 l -215.629 -100.408 h -0.0512 Z" p-id="13036" /></svg>
                    &nbsp;项目组
                  </div>
                </DropdownItem>
                <DropdownItem @click.native="handleSelect(4)">
                  <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1097 1024" width="15" height="15" t="1591164421861" p-id="2294" version="1.1"><path d="M 612.498 762.587 v 113.445 h 253.879 a 42.5691 42.5691 0 0 1 0 85.1383 H 264.923 a 42.5691 42.5691 0 0 1 0 -85.1383 h 253.952 v -113.445 H 165.157 A 113.957 113.957 0 0 1 50.7611 649.07 V 138.386 c 0 -62.6834 51.2 -113.445 114.395 -113.445 H 966.217 c 63.2686 0 114.469 50.7611 114.469 113.445 v 510.683 c 0 62.6834 -51.2 113.518 -114.469 113.518 H 612.498 Z M 197.047 471.04 H 362.057 l 35.2549 87.9177 c 9.50857 23.7714 43.4469 23.9177 53.1017 0.146286 l 111.835 -275.017 l 81.7737 170.789 a 28.5989 28.5989 0 0 0 25.8194 16.1646 h 277.723 a 28.5257 28.5257 0 0 0 28.672 -28.3794 a 28.5257 28.5257 0 0 0 -28.672 -28.3063 h -259.657 L 585.874 201.289 a 28.672 28.672 0 0 0 -52.3703 1.46286 L 424.009 472.21 l -16.0183 -39.936 a 28.5989 28.5989 0 0 0 -26.5509 -17.8469 h -184.32 a 28.5257 28.5257 0 0 0 -28.5989 28.3063 a 28.5257 28.5257 0 0 0 28.5257 28.3794 Z" p-id="2295" /></svg>
                    &nbsp;在线调试
                  </div>
                </DropdownItem>
                <DropdownItem @click.native="handleSelect(5)">
                  <div style="display:flex;justify-content:center;align-items:center;font-size:12px">
                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1344 1024" width="15" height="15" t="1594280152052" p-id="2111" version="1.1"><path fill="#2c2c2c" d="M 1331.97 482.112 L 1036.16 183.488 a 41.6 41.6 0 0 0 -60.032 0 a 42.56 42.56 0 0 0 0 60.544 L 1242.43 512 l -266.24 268.8 a 42.56 42.56 0 0 0 0 60.608 a 40.704 40.704 0 0 0 59.136 0 l 295.744 -298.688 a 43.328 43.328 0 0 0 0.896 -60.608 Z M 369.536 183.488 a 41.6 41.6 0 0 0 -59.968 0 L 13.824 482.112 a 42.56 42.56 0 0 0 0 60.608 l 295.68 298.688 c 8.512 7.68 19.456 11.904 30.464 11.904 a 39.424 39.424 0 0 0 29.568 -12.8 a 42.56 42.56 0 0 0 0 -60.544 L 103.36 512 l 266.24 -268.8 a 43.072 43.072 0 0 0 0 -59.712 Z m 441.088 -181.76 a 41.408 41.408 0 0 0 -51.456 29.568 L 505.6 970.24 c -5.952 23.04 6.72 46.08 29.568 52.032 a 49.024 49.024 0 0 0 10.944 1.728 c 18.56 0 35.52 -12.8 40.576 -31.552 L 840.128 53.76 a 42.24 42.24 0 0 0 -29.248 -51.968 l -0.256 -0.064 Z" p-id="2112" /></svg>
                    &nbsp;数据格式化
                  </div>
                </DropdownItem>
            </DropdownMenu>
          </Dropdown>
        </ListItem>
        <ListItem style="padding:10px" @click.native="handleSelect(3)">
          <el-avatar v-if="userInfo.portraitUrl" :size="25" :src="userInfo.portraitUrl"></el-avatar>
          <el-avatar v-else :size="25">{{userInfo.nickname.substring(0,1)}}</el-avatar>
        </ListItem>
      </List>
    </div>
      <!-- 附加组件 -->
      <!-- 项目接口列表 -->
        <el-drawer
            :visible.sync="projectInfo.flag"
            :with-header="false"
            :size="'100%'">
            <el-card class="box-card" style="height:100%" :body-style="{height: 'calc(100% - 105px)',overflow: 'auto'}">
            <div slot="header" style="text-align:center" >
                <el-button style="float:left;padding:0;color:#606266;font-size:20px" type="text" icon="el-icon-back" @click="projectInfo.flag = false"></el-button>
                <span style="display: inline-block;width: calc(100% - 100px);overflow: hidden;margin-left:-20px;white-space: nowrap;">{{projectInfo.name}}</span>
            </div>
            <!-- 操作 -->
            <div style="text-align:right;margin-bottom:20px">
              <el-button style=" margin: 10px 0 0 0" size="mini" icon="el-icon-refresh" @click="getProjectApiList(1);">
                  <span class="tips">刷新</span>
              </el-button>
              <el-button style=" margin: 10px 0 0 0" size="mini" @click="filterApi.flag = !filterApi.flag;">
                <Icon type="ios-options" />
                <span class="tips">筛选</span>
              </el-button>
              <el-button style=" margin: 10px 0 0 0" size="mini" @click="openInterfaceOnLine">
                <Icon type="md-bug" />
                <span class="tips">在线调试</span>
              </el-button>
              <el-button style=" margin: 10px 0 0 0" size="mini" icon="el-icon-plus" @click="createApi">
                  <span class="tips">新建接口</span>
              </el-button>
              <el-popconfirm
                title="确认删除此项目?此操作不可逆"
                @onConfirm="deleteProject"
              >
                <el-button slot="reference" style=" margin: 10px 0 0 0" size="mini" icon="el-icon-close">
                  <span class="tips">删除项目</span>
                </el-button>
              </el-popconfirm>
              <el-popover
                placement="top-start"
                width="200"
                trigger="click">
                <p>项目全接口PDF导出,如项目接口过多可自由选择下方接口(可分页多选)。确认导出全部?</p>
                <div style="text-align: right; margin: 10px 0 0 0">
                  <el-button type="primary" style="width:100%" size="mini" @click="downProjectPdf">确认</el-button>
                </div>
                <el-button size="mini" slot="reference" style="margin:0;margin-top:10px" icon="el-icon-download">导出PDF</el-button>
              </el-popover>
              <el-button size="mini" @click="downProjectPdfBySelect" v-show="projectApi.selectApiList.length > 0" style="margin-top:10px" icon="el-icon-download">导出已选择</el-button>
            </div>
            <!-- 筛选区 -->
             <transition name="el-zoom-in-top">
              <div style="margin-bottom:10px" v-if="filterApi.flag" v-loading="filterApi.loadingFlag">
                <!-- name输入框 -->
                <el-input placeholder="请输入接口名称(模糊搜索)" size="mini" v-model="filterApi.name">
                </el-input>
                <!-- method列表 (横向) -->
                <div style="text-align:left;margin-top:10px;white-space: nowrap;text-align: left;overflow-x: auto;padding: 10px 0;">
                  <span class="tips">Method(可多选)：</span>
                  <Tag v-for="(item, i) in filterApi.method" color="primary" checkable :checked="false"
                  :name="item.value" :key="i" @on-change="filterApiChangeConditions('method', item.value)">{{item.label}}</Tag>
                </div>
                <!-- 用户信息列表 (横向) -->
                <div style="margin-top:10px;">
                  <div class="tips" style="text-align:left">API创建者列表</div>
                  <div style="white-space: nowrap;text-align: left;overflow-x: auto;padding: 10px 0;">
                      <div style="display:inline-table" v-for="(item, i) in filterApi.create" :key="i">
                          <div style="margin:auto;text-align:center;margin:10px">
                              <el-avatar style="box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);" v-if="item.portraitUrl" :size="50" :src="item.portraitUrl"></el-avatar>
                              <el-avatar style="box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);" v-else :size="50">{{item.nickname.substring(0,1)}}</el-avatar>
                          </div>
                          <div style="text-align:center;margin-top:5px">
                              <el-tag size="mini" style="white-space:normal;height:auto;word-break:break-all">{{item.nickname}}
                              <el-checkbox @change="filterApiChangeConditions('create', item.usersUid)"></el-checkbox>
                              </el-tag>
                          </div>
                      </div>
                  </div>
                  <!-- 分页 -->
                  <el-pagination style="margin-top:5px;white-space: normal;"
                    @current-change="getApiCreateList"
                    :current-page.sync="filterApi.createPageNo"
                    background
                    :page-size="pageSize"
                    layout="prev, next"
                    :total="filterApi.createTotal" v-if="filterApi.create.length !== 0">
                  </el-pagination>
                </div>
                <!-- 提交 -->
                <div style="text-align:right">
                  <el-button size="mini" icon="el-icon-search" @click="filterApiList(1)">搜索</el-button>
                </div>
              </div>
             </transition>
            <!-- 内容 -->
            <div>
            <Col :xs="{span:24}" :sm="{span:22,offset:1}" :md="{span:20,offset:2}">
              <div v-if="projectApi.list.length > 0">
                <List border>
                  <ListItem v-for="(item,i) in projectApi.list" style="margin-bottom:10px;cursor:pointer" :key="i">
                    <div style="text-align:left;overflow:hidden;width:calc(100% - 50px);display:inline-block;white-space:nowrap" @click="getProjectApiParamList(item.id, item)">
                      <el-tag effect="dark" size="mini">{{item.method === 'unlimited' ? '无限制' : item.method}}</el-tag>
                      {{item.name}}
                      <div class="tips" style="margin-top:5px">{{item.apiCreateName}}创建于<Time :time="item.createTime"></Time></div>
                    </div>
                    <CHECKBOX :style="{float: 'right'}" :checked="checkApiSelect(item.id) !== -1" @lseCheckBox="lseCheckBox" :trueBack="item.id" :falseBack="item.id"></CHECKBOX>
                  </ListItem>
                </List>
                <!-- 分页 标记点* -->
                <el-pagination style="margin:20px 0;white-space: normal;"
                  @current-change="getProjectApiSelect"
                  :current-page.sync="projectApi.pageNo"
                  background
                  :page-size="pageSize"
                  layout="prev, next"
                  :total="projectApi.total">
                </el-pagination>
              </div>
              <div v-else>
                <img :src="notData" draggable="false">
                <div style="font-size:12px">暂无接口</div>
              </div>
              </Col>
            </div>
            </el-card>
        </el-drawer>
      <!-- 弹出框 -->
        <el-drawer
            :visible.sync="pubilcDrawer"
            :with-header="false"
            :size="isXs ? '100%':'40%'">
            <el-card class="box-card" style="height:100%" :body-style="{height: 'calc(100% - 105px)',padding: '10px',overflow: 'auto'}">
            <div slot="header" style="text-align:center" >
                <el-button style="float:left;padding:0;color:#606266;font-size:20px" type="text" icon="el-icon-back" @click="pubilcDrawer = false"></el-button>
                <span style="display: inline-block;width: calc(100% - 100px);overflow: hidden;margin-left:-20px;white-space: nowrap;">{{pubilcDrawerTitle}}</span>
            </div>
            <!-- 内容 -->
            <div>
              <!-- 创建项目 createProject -->
              <div v-if="pubilcDrawerType === 'createProject'">
                <el-form label-position="top" label-width="100px" :model="project.obj">
                  <el-form-item label="项目名称" style="text-align:left">
                    <el-input v-model="project.obj.projectName" maxlength="50" show-word-limit></el-input>
                  </el-form-item>
                  <el-form-item label="项目简介" style="text-align:left">
                    <el-input v-model="project.obj.projectInfo" type="textarea" :rows="5" maxlength="800" show-word-limit></el-input>
                  </el-form-item>
                </el-form>
                <div style="text-align:right">
                    <el-button size="mini" @click="createProject">提交</el-button>
                </div>
              </div>
              <!-- 创建项目组 createGroup -->
              <div v-if="pubilcDrawerType === 'createGroup'">
                <el-form label-position="top" label-width="100px" :model="group.obj">
                  <el-form-item label="项目组名称" style="text-align:left">
                    <el-input v-model="group.obj.groupName" maxlength="50" show-word-limit></el-input>
                  </el-form-item>
                  <el-form-item label="项目组简介" style="text-align:left">
                    <el-input v-model="group.obj.groupInfo" type="textarea" :rows="5" maxlength="800" show-word-limit></el-input>
                  </el-form-item>
                </el-form>
                <div style="text-align:right">
                    <el-button size="mini" @click="createGroup">提交</el-button>
                </div>
              </div>
              <!-- 项目选择 -->
              <div v-if="pubilcDrawerType === 'selectProject'">
                <waterfall :col="2" :data="project.list" style="margin:10px 0" v-show="project.list.length !== 0">
                  <template>
                    <el-card class="waterfall-item" v-for="(item,index) in project.list" :key="index" :body-style="{cursor:'pointer',padding: '10px'}">
                      <div slot="header" class="clearfix">
                        <b>{{item.projectName}}</b>
                      </div>
                      <div @click="projectApi.projectId = item.id;projectInfo.name=item.projectName;
                      projectApi.selectApiList = [];getProjectApiList(1);getApiCreateList(1);filterApi.name = '';filterApi.selectCreate = [];filterApi.selectMethod = [];filterApi.flag=false">
                        <div class="text item" >{{item.projectInfo ? item.projectInfo : '暂无简介'}}</div>
                      </div>
                      <div class="bottom clearfix">
                        <div class="tips">
                        <Time :time="item.createTime"/>&nbsp;创建
                        </div>
                        <el-button size="mini" style="width:100%;margin-top:10px" @click="projectToGroup(item.id)">添加至项目组</el-button>
                      </div>
                    </el-card>
                  </template>
                </waterfall>
                <!-- 分页 -->
                <el-pagination style="margin:20px 0;white-space: normal;"
                  @current-change="getProjectList"
                  :current-page.sync="project.pageNo"
                  background
                  :page-size="pageSize"
                  layout="prev, next"
                  :total="project.total" v-if="project.list.length !== 0">
                </el-pagination>
                <div  v-show="project.list.length === 0">
                  <img :src="notData" draggable="false">
                  <div style="font-size:12px">暂无项目</div>
                </div>
              </div>
              <!-- 项目组内成员 -->
              <div v-if="pubilcDrawerType === 'groupUser'">
                <List border>
                  <ListItem v-for="(item, i) in groupUser.list" :key="i">
                  <el-avatar v-if="item.userInfo.portraitUrl" :src="item.userInfo.portraitUrl"></el-avatar>
                  <el-avatar v-else>{{item.userInfo.nickname.substring(0,1)}}</el-avatar>
                  <div style="display:inline;margin-left:10px;width: 60%;overflow: hidden;text-align:left">
                    <span>{{item.userInfo.nickname}} <Tag v-if="item.isCreate" color="primary">创建者</Tag></span>
                    <div class="tips">
                    <Time :time="item.joinTime"/>&nbsp;加入
                    </div>
                  </div>
                  <template slot="action">
                    <li>
                      <a style="font-size:12px" @click="kickGroupUser(item.userId)">清除</a>
                    </li>
                  </template>
                  </ListItem>
                </List>
                <!-- 分页 -->
                <el-pagination style="margin:20px 0;white-space: normal;"
                  @current-change="getUserListByGroup"
                  :current-page.sync="groupUser.pageNo"
                  background
                  :page-size="pageSize"
                  layout="prev, next"
                  :total="groupUser.total" v-if="groupUser.list.length !== 0">
                </el-pagination>
                <div  v-show="groupUser.list.length === 0">
                    <img :src="notData" draggable="false">
                  <div style="font-size:12px">暂无组成员</div>
                </div>
              </div>
              <!-- 项目组组员申请 -->
              <div v-if="pubilcDrawerType === 'groupUserAudit'">
                <List border>
                  <ListItem style="" v-for="(item, i) in groupUserAudit.list" :key="i" >
                    <el-avatar v-if="item.userInfo.portraitUrl" :src="item.userInfo.portraitUrl"></el-avatar>
                    <el-avatar v-else>{{item.userInfo.nickname.substring(0,1)}}</el-avatar>
                    <div style="display:inline;margin-left:10px;width: 60%;overflow: hidden;text-align:left">
                      <span>{{item.userInfo.nickname}}</span>
                      <div class="tips">
                      <Time :time="item.createTime"/>&nbsp;申请
                      </div>
                      <div class="tips">{{item.inviterInfo !== null ? '邀请者: '+item.inviterInfo.nickname : '无邀请者'}}</div>
                    </div>
                    <div style="position: absolute;right: 25px;">
                        <Select slot="extra" v-model="item.isJoin" :disabled="item.isJoin !== 0 && item.isJoin !== 0+'_'+item.id" @on-change="updateGroupUserAudit" size="small">
                          <Option :value="0">等待处理</Option>
                          <Option :value="item.isJoin.length > 1 ? 1+'_'+item.id : 1" v-if="item.isJoin === 1 + '_' + item.id || item.isJoin === 1">已同意</Option>
                          <Option :value="1+'_'+item.id" v-else>同意</Option>
                          <Option :value="item.isJoin.length > 1 ? 2+'_'+item.id : 2" v-if="item.isJoin === 2 + '_' + item.id || item.isJoin === 2">已拒绝</Option>
                          <Option :value="2+'_'+item.id" v-else>拒绝</Option>
                        </Select>
                    </div>
                  </ListItem>
                </List>
                <!-- 分页 -->
                <el-pagination style="margin:20px 0;white-space: normal;"
                  @current-change="getAuditListByGroup"
                  :current-page.sync="groupUserAudit.pageNo"
                  background
                  :page-size="pageSize"
                  layout="prev, next"
                  :total="groupUserAudit.total" v-if="groupUserAudit.list.length !== 0">
                </el-pagination>
                <div  v-show="groupUserAudit.list.length === 0">
                    <img :src="notData" draggable="false">
                  <div style="font-size:12px">暂无项目组加入申请</div>
                </div>
              </div>
              <!-- 查找项目组 -->
              <div v-if="pubilcDrawerType === 'findGroup'">
                <div>
                  <el-input v-model="group.findKey" placeholder="请输入项目组密钥">
                    <el-button icon="el-icon-search" slot="append" @click="findGroup"></el-button>
                  </el-input>
                </div>
                 <Divider></Divider>
                <el-card v-if="group.findGroupData">
                  <div slot="header" class="clearfix">
                    <b>{{group.findGroupData.groupName}}</b>
                  </div>
                  <div>
                    <div class="text item" >{{group.findGroupData.groupInfo ? group.findGroupData.groupInfo : '暂无简介'}}</div>
                    <div class="bottom clearfix">
                      <div class="tips">
                      <Time :time="group.findGroupData.createTime"/>&nbsp;创建
                      </div>
                    </div>
                    <el-button size="mini" style="margin-top:10px;width:100%" @click="sendGroupAudit">申请加入</el-button>
                  </div>
                </el-card>
              </div>
              <!-- 项目日志 -->
              <div v-if="pubilcDrawerType === 'projectLog'">
                <List border>
                  <ListItem v-for="(item, i) in projectLog.list" :key="i" :style="{
                    background: item.logInfo.indexOf('Add') === 0 || item.logInfo.indexOf('新增') === 0 ? '#2db7f5' :
                    item.logInfo.indexOf('Update') === 0 || item.logInfo.indexOf('更新') === 0 ? '#ff9900' :
                    item.logInfo.indexOf('Delete') === 0 || item.logInfo.indexOf('删除') === 0 ? '#ed4014' : ''
                  }">
                     <div style="text-align:left">
                        <Tag color="blue">{{item.userInfo.nickname}}</Tag>{{item.logInfo}}
                      <div class="tips" style="color:black;margin-top:5px;">
                        {{item.ipAddress}}<Divider type="vertical"></Divider><Time :time="item.logTime"/>
                      </div>
                     </div>
                  </ListItem>
                </List>
                <!-- 分页 -->
                <el-pagination style="margin:20px 0;white-space: normal;"
                  @current-change="getLogs"
                  :current-page.sync="projectLog.pageNo"
                  background
                  :page-size="pageSize"
                  layout="prev, next"
                  :total="projectLog.total" v-if="projectLog.list.length !== 0">
                </el-pagination>
                <div  v-show="projectLog.list.length === 0">
                    <img :src="notData" draggable="false">
                  <div style="font-size:12px">暂无日志</div>
                </div>
              </div>
            </div>
            </el-card>
        </el-drawer>
      <!-- 接口在线调试 -->
        <el-drawer
            :visible.sync="interfaceOnline.flag"
            :with-header="false"
            :size="'100%'">
            <el-card class="box-card" style="height:100%" :body-style="{height: 'calc(100% - 105px)',overflow: 'auto'}">
            <div slot="header" style="text-align:center" >
                <el-button style="float:left;padding:0;color:#606266;font-size:20px" type="text" icon="el-icon-back" @click="interfaceOnline.flag = false"></el-button>
                <span style="display: inline-block;width: calc(100% - 100px);overflow: hidden;margin-left:-20px;white-space: nowrap;">{{interfaceOnline.name}}</span>
            </div>
            <!-- 内容 -->
            <INTERFACE :urlInside="interfaceOnline.apiInfo.url"
            :paramsDataInside="interfaceOnline.params" :projectIdInside="interfaceOnline.projectId" @getProjectApiList='getProjectApiList'></INTERFACE>
            </el-card>
        </el-drawer>
    </div>
</template>

<script>
import API from './api/api'
import CREATEAPI from './util/create_api'
import IFRAME from './util/iframe'
import CHECKBOX from './util/check_box'
import ALERT from './util/alert'
// 用户个人信息
import USERHOME from './user/UserHome'
// 在线调试
import INTERFACE from './api/InterfaceTest'
// 引入引导页 1.3 取消引导页
// import guide from '../util/guide/guide'
// 引入网站信息
import WEBINFO from './user/WebsiteInfo'
// 1.2 新增数据展示页面
import DATAVIEW from './util/data_view'
export default {
  name: 'Home',
  data () {
    return {
      headIsCollapsed: false,
      token: this.lseajax.storageJson.get(this.lsedata.tokenName),
      // eslint-disable-next-line no-eval
      lsePerflag: eval(this.lseajax.storageJson.get(this.lsedata.lsePerflag)),
      userInfo: this.$store.state.userInfo,
      notData: './static/img/not_data.png',
      per: {},
      tabIndex: 1,
      waterfallCol: 4,
      pageSize: 20,
      pubilcDrawer: false,
      pubilcDrawerTitle: '',
      pubilcDrawerType: '',
      isXs: false,
      //  项目
      project: {
        list: [],
        pageNo: 1,
        total: 0,
        obj: {},
        firstFlag: true
      },
      // 项目信息 - 已选中
      projectInfo: {
        flag: false,
        name: '',
        type: 'project'
      },
      // 项目接口与筛选区别
      isApiListOrFilter: true,
      // 项目接口
      projectApi: {
        projectId: '',
        list: [],
        pageNo: 1,
        total: 0,
        obj: {},
        selectApiList: []
      },
      // 接口筛选
      filterApi: {
        loadingFlag: false,
        flag: false,
        create: [],
        createPageNo: 1,
        createTotal: 0,
        name: '',
        method: [{
          value: 'unlimited',
          label: '无限制'
        }, {
          value: 'GET',
          label: 'GET'
        }, {
          value: 'POST',
          label: 'POST'
        }, {
          value: 'PUT',
          label: 'PUT'
        }, {
          value: 'PATCH',
          label: 'PATCH'
        }, {
          value: 'DELETE',
          label: 'DELETE'
        }, {
          value: 'COPY',
          label: 'COPY'
        }, {
          value: 'HEAD',
          label: 'HEAD'
        }, {
          value: 'OPTIONS',
          label: 'OPTIONS'
        }, {
          value: 'LINK',
          label: 'LINK'
        }, {
          value: 'UNLINK',
          label: 'UNLINK'
        }, {
          value: 'PURGE',
          label: 'PURGE'
        }, {
          value: 'LOCK',
          label: 'LOCK'
        }, {
          value: 'UNLOCK',
          label: 'UNLOCK'
        }, {
          value: 'PROPFIND',
          label: 'PROPFIND'
        }, {
          value: 'VIEW',
          label: 'VIEW'
        }],
        selectCreate: [],
        selectMethod: []
      },
      // 项目组
      group: {
        listMe: [],
        listMeLoadingFlag: false,
        listJoin: [],
        listJoinLoadingFlag: false,
        pageNoMe: 1,
        pageNoJoin: 1,
        totalJoin: 0,
        totalMe: 0,
        obj: {},
        selected: 'group',
        findKey: '',
        findGroupData: undefined,
        firstFlagMe: true,
        firstFlagJoin: true
      },
      // 选中的项目组
      selectedGroup: [],
      // 选中的项目组旗下项目
      groupInfoProject: {
        list: [],
        groupId: 0
      },
      // 项目组成员
      groupUser: {
        pageNo: 1,
        list: [],
        total: 0
      },
      // 项目组申请审核
      groupUserAudit: {
        pageNo: 1,
        list: [],
        total: 0
      },
      // 个人统计信息
      statistical: undefined,
      statisticalLoading: true,
      firstFlagSta: true,
      // 项目日志
      projectLog: {
        pageNo: 1,
        list: [],
        total: 0
      },
      // 在线调试
      interfaceOnline: {
        flag: false,
        name: 'LSE API接口在线调试',
        apiInfo: {},
        params: [],
        projectId: ''
      }
    }
  },
  components: {
    CHECKBOX,
    USERHOME,
    INTERFACE,
    WEBINFO,
    DATAVIEW
  },
  methods: {
    //   读取个人信息
    getUserInfo () {
      this.lseajax.post(this.lseajax.baseurl + '/api/userInfo/getLoginUserInfo', {}).then((data) => {
        if (data.code === 200) {
          // 向个人信息区添加数据
          // this.$store.commit('updateUserInfo', data.data)
          this.userInfo = data.data
          if (this.lsePerflag) {
            // 设置背景图片
            this.per = {
              backgroundImage: 'url(' + data.data.backgroundImage + ')',
              backgroundRepeat: 'no-repeat',
              backgroundPosition: 'center center',
              backgroundSize: 'cover'
            }
          }
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
          this.lseajax.storageJson.remove(this.lsedata.tokenName)
          this.lseutil.go('login')
        }
      })
    },
    // 读取项目列表
    getProjectList (pageNo) {
      this.project.pageNo = pageNo
      let loading = this.lseutil.loading('正在读取项目列表')
      this.lseajax.post(this.lseajax.baseurl + '/api/project/getProjectList', {
        pageSize: this.pageSize,
        pageNo: pageNo
      }).then((data) => {
        if (data.code === 200) {
          this.project.list = data.data.list
          this.project.total = data.data.total
          this.project.firstFlag = false
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 创建项目
    createProject () {
      let loading = this.lseutil.loading('正在创建')
      this.lseajax.post(this.lseajax.baseurl + '/api/project/createProject', this.project.obj).then((data) => {
        if (data.code === 200) {
          this.pubilcDrawer = false
          this.getProjectList(1)
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 读取接口列表
    getProjectApiList (pageNo) {
      this.isApiListOrFilter = true
      this.projectApi.pageNo = pageNo
      let loading = this.lseutil.loading('正在读取接口列表')
      this.lseajax.post(this.lseajax.baseurl + '/api/project/getProjectApiList', {
        pageSize: this.pageSize,
        pageNo: pageNo,
        project: this.projectApi.projectId
      }).then((data) => {
        if (data.code === 200) {
          this.projectApi.list = data.data.list
          this.projectApi.total = data.data.total
          this.projectInfo.flag = true
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 读取接口参数
    getProjectApiParamList (api, item) {
      let that = this
      let loading = this.lseutil.loading('正在读取接口详情')
      this.lseajax.post(this.lseajax.baseurl + '/api/project/getProjectApiParamList', {
        api: api,
        project: this.projectApi.projectId
      }).then((data) => {
        if (data.code === 200) {
          // 注入在线调试内容
          this.interfaceOnline.apiInfo = item
          this.interfaceOnline.params = []
          this.interfaceOnline.projectId = ''
          data.data.forEach(item => {
            let param = {
              key: item.paramName,
              value: item.paramType.toLowerCase() !== 'int' ? 'Test' : 1
            }
            this.interfaceOnline.params.push(param)
          })
          API.install({
            apiInfo: item,
            params: data.data,
            methods: [
              function () {
                that.getProjectApiList(1)
              },
              function () {
                that.interfaceOnline.flag = true
              }
            ]
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 创建API
    createApi () {
      let that = this
      CREATEAPI.install({
        projectId: this.projectApi.projectId,
        getProjectApiList: function () {
          that.getProjectApiList(1)
        }
      })
    },
    // 删除项目
    deleteProject () {
      let that = this
      ALERT.install({
        titleCenter: true,
        title: '项目清除',
        msg: '确认清除该项目?此操作不可逆',
        confirm: function () {
          let loading = this.lseutil.loading('正在清除')
          this.lseajax.post(this.lseajax.baseurl + '/api/project/deleteProject', {
            project: that.projectApi.projectId
          }).then((data) => {
            if (data.code === 200) {
              this.lseutil.msg({
                msg: data.msg
              })
              that.projectInfo.flag = false
              that.getProjectList(1)
            } else {
              this.lseutil.msg({
                msg: data.msg
              })
            }
            loading.close()
          }).catch(res => {
            loading.close()
          })
        }
      })
    },
    // 导出全接口PDF文件
    downProjectPdf () {
      let loading = this.lseutil.loading('正在生成项目全接口PDF文件')
      this.lseajax.post(this.lseajax.baseurl + '/api/project/getProjectPdf', {
        project: this.projectApi.projectId
      }).then((data) => {
        if (data.code === 200) {
          IFRAME.install({
            url: data.data
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 导出用户选择的api
    downProjectPdfBySelect () {
      let loading = this.lseutil.loading('正在生成你选择的接口PDF文件')
      this.lseajax.post(this.lseajax.baseurl + '/api/project/getProjectPdfBySelect', {
        project: this.projectApi.projectId,
        select: this.projectApi.selectApiList
      }, true, 'brackets').then((data) => {
        if (data.code === 200) {
          IFRAME.install({
            url: data.data
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 读取项目组 - by me
    getGroupListByMe (pageNo) {
      this.group.pageNoMe = pageNo
      this.group.listMeLoadingFlag = true
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/getGroupListByMe', {
        pageSize: this.pageSize,
        pageNo: pageNo
      }).then((data) => {
        if (data.code === 200) {
          this.group.listMe = data.data.list
          this.group.totalMe = data.data.total
          this.group.firstFlagMe = false
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        this.group.listMeLoadingFlag = false
      }).catch(res => {
        this.group.listMeLoadingFlag = false
      })
    },
    // 读取项目组 - 加入的
    getGroupListByJoin (pageNo) {
      this.group.pageNoJoin = pageNo
      this.group.listJoinLoadingFlag = true
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/getGroupListByJoin', {
        pageSize: this.pageSize,
        pageNo: pageNo
      }).then((data) => {
        if (data.code === 200) {
          this.group.listJoin = data.data.list
          this.group.totalJoin = data.data.total
          this.group.firstFlagJoin = false
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        this.group.listJoinLoadingFlag = false
      }).catch(res => {
        this.group.listJoinLoadingFlag = false
      })
    },
    // api 多选
    lseCheckBox (item, flag) {
      if (flag === false) {
        let index = this.checkApiSelect(item)
        if (index !== -1) {
          this.projectApi.selectApiList.splice(index, 1)
        }
      } else {
        this.projectApi.selectApiList.push(item)
      }
    },
    checkApiSelect (item) {
      let index = this.projectApi.selectApiList.findIndex(itemx => itemx === item)
      return index
    },
    // 创建群组
    createGroup () {
      let loading = this.lseutil.loading('正在创建')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/createGroup', this.group.obj).then((data) => {
        if (data.code === 200) {
          this.pubilcDrawer = false
          this.getGroupListByMe(1)
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    lsePerflagSetting (flag) {
      this.lseajax.storageJson.set(this.lsedata.lsePerflag, flag)
      if (this.lsePerflag) {
        // 设置背景图片
        this.per = {
          backgroundImage: 'url(' + this.userInfo.backgroundImage + ')',
          backgroundRepeat: 'no-repeat',
          backgroundPosition: 'center center',
          backgroundSize: 'cover'
        }
      } else {
        this.per = {}
      }
    },
    handleSelect (key) {
      this.tabIndex = parseInt(key)
      switch (parseInt(key)) {
        case 1:
          if (this.project.firstFlag) {
            this.getProjectList(1)
          }
          break
        case 2:
          if (this.group.firstFlagMe) {
            this.getGroupListByMe(1)
          }
          if (this.group.firstFlagJoin) {
            this.getGroupListByJoin(1)
          }
          break
        case 3:
          if (this.firstFlagSta) {
            this.getUserStatistical()
          }
          break
        default:
          break
      }
    },
    // 选中项目组
    selectedGroups (item) {
      this.selectedGroup.push(item)
      this.group.selected = item.groupName + '_' + (this.selectedGroup.length - 1) + '_' + item.id
      this.groupInfoProject.groupId = item.id
      this.getProjectListByGroup()
    },
    // 项目组 - 删除tab
    groupTabRemove (targetName) {
      if (targetName === 'group') {
        this.lseutil.msg({
          msg: '你不能关闭此栏目'
        })
      } else {
        let data = targetName.split('_')
        this.selectedGroup.splice(parseInt(data[1]), 1)
      }
    },
    // 项目组 - tab点击
    groupTabClick (name) {
      if (name !== 'group') {
        let data = name.split('_')
        this.groupInfoProject.groupId = data[2]
        this.getProjectListByGroup()
      }
    },
    // 读取项目组旗下项目列表
    getProjectListByGroup () {
      let loading = this.lseutil.loading('正在读取旗下项目')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/getProjectListByGroup', {
        group: this.groupInfoProject.groupId
      }).then((data) => {
        if (data.code === 200) {
          this.groupInfoProject.list = data.data
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 项目迁移至项目组
    projectToGroup (projectId) {
      let loading = this.lseutil.loading('正在迁移')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/projectToGroup', {
        group: this.groupInfoProject.groupId,
        project: projectId
      }).then((data) => {
        if (data.code === 200) {
          this.getProjectListByGroup()
          this.lseutil.msg({
            msg: data.msg,
            type: 1
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 项目迁移出项目组
    projectOutGroup (projectId) {
      let loading = this.lseutil.loading('正在迁移')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/projectOutGroup', {
        groupId: this.groupInfoProject.groupId,
        projectId: projectId
      }).then((data) => {
        if (data.code === 200) {
          this.getProjectListByGroup()
          this.lseutil.msg({
            msg: data.msg,
            type: 1
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 解散项目组
    dissolveGroup () {
      let that = this
      ALERT.install({
        titleCenter: true,
        title: '解散项目组',
        msg: '确认解散?此操作不可逆',
        confirm: function () {
          let loading = this.lseutil.loading('正在清除数据')
          this.lseajax.post(this.lseajax.baseurl + '/api/groups/dissolveGroup', {
            group: that.groupInfoProject.groupId
          }).then((data) => {
            if (data.code === 200) {
              that.getProjectListByGroup()
              this.lseutil.msg({
                msg: data.msg,
                type: 1
              })
            } else {
              this.lseutil.msg({
                msg: data.msg
              })
            }
            loading.close()
          }).catch(res => {
            loading.close()
          })
        }
      })
    },
    // 查询项目组成员
    getUserListByGroup (pageNo) {
      this.groupUser.pageNo = pageNo
      let loading = this.lseutil.loading('正在读取')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/getUserListByGroup', {
        group: this.groupInfoProject.groupId,
        pageNo: pageNo,
        pageSize: this.pageSize
      }).then((data) => {
        if (data.code === 200) {
          this.groupUser.list = data.data.list
          this.groupUser.total = data.data.total
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // T出群成员
    kickGroupUser (userId) {
      let that = this
      ALERT.install({
        titleCenter: true,
        title: '成员清除',
        msg: '确认清除该成员?此操作不可逆',
        confirm: function () {
          let loading = this.lseutil.loading('正在清除成员')
          this.lseajax.post(this.lseajax.baseurl + '/api/groups/kickGroupUser', {
            group: that.groupInfoProject.groupId,
            user: userId
          }).then((data) => {
            if (data.code === 200) {
              that.getUserListByGroup(1)
              that.getProjectListByGroup()
              this.lseutil.msg({
                msg: data.msg,
                type: 1
              })
            } else {
              this.lseutil.msg({
                msg: data.msg
              })
            }
            loading.close()
          }).catch(res => {
            loading.close()
          })
        }
      })
    },
    // 读取项目组申请审核
    getAuditListByGroup (pageNo) {
      this.groupUserAudit.pageNo = pageNo
      let loading = this.lseutil.loading('正在读取')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/getAuditListByGroup', {
        group: this.groupInfoProject.groupId,
        pageNo: pageNo,
        pageSize: this.pageSize
      }).then((data) => {
        if (data.code === 200) {
          this.groupUserAudit.list = data.data.list
          this.groupUserAudit.total = data.data.total
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 审批项目组组员申请
    updateGroupUserAudit (value) {
      if (value === undefined || value === null) {
        return
      }
      let join = value.split('_')[0]
      let audit = value.split('_')[1]
      let loading = this.lseutil.loading('处理中')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/updateGroupUserAudit', {
        audit: audit,
        join: join
      }).then((data) => {
        if (data.code === 200) {
          this.lseutil.msg({
            msg: data.msg,
            type: 1
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 获取项目组密钥 - 用于精确查找
    getGroupSale () {
      let loading = this.lseutil.loading('正在生成')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/getGroupSale', {
        group: this.groupInfoProject.groupId
      }).then((data) => {
        if (data.code === 200) {
          this.lseutil.alert(data.data, {
            okText: '复制',
            title: '项目组密钥',
            type: 'success',
            onOk: function () {
              let doc = document.createElement('input')
              doc.setAttribute('value', data.data)
              document.body.appendChild(doc)
              doc.select()
              document.execCommand('Copy')
              document.body.removeChild(doc)
              this.lseutil.msg({
                msg: '复制成功'
              })
            }
          })
          this.lseutil.msg({
            msg: data.msg,
            type: 1,
            time: 5
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 精确查找项目组
    findGroup () {
      let loading = this.lseutil.loading('正在查找')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/findGroup', {
        group: this.group.findKey
      }).then((data) => {
        if (data.code === 200) {
          this.group.findGroupData = data.data
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 发送审批记录
    sendGroupAudit () {
      let that = this
      ALERT.install({
        titleCenter: true,
        title: '确认申请',
        msg: '确认申请加入该项目组?',
        confirm: function () {
          let loading = this.lseutil.loading('正在提交')
          this.lseajax.post(this.lseajax.baseurl + '/api/groups/sendGroupAudit', {
            groupId: that.group.findGroupData.id
          }).then((data) => {
            if (data.code === 200) {
              this.lseutil.msg({
                msg: data.msg,
                type: 1
              })
            } else {
              this.lseutil.msg({
                msg: data.msg
              })
            }
            loading.close()
          }).catch(res => {
            loading.close()
          })
        }
      })
    },
    // 读取个人统计信息
    getUserStatistical () {
      this.statisticalLoading = true
      this.lseajax.post(this.lseajax.baseurl + '/api/userInfo/getUserStatistical', {}).then((data) => {
        if (data.code === 200) {
          this.statistical = data.data
          this.firstFlagSta = false
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        this.statisticalLoading = false
      }).catch(res => {
        this.statisticalLoading = false
      })
    },
    // 项目日志
    getLogs (pageNo) {
      this.projectLog.pageNo = pageNo
      let loading = this.lseutil.loading('正在读取日志列表')
      this.lseajax.post(this.lseajax.baseurl + '/api/projectLog/getLogs', {
        pageSize: this.pageSize,
        pageNo: pageNo,
        project: this.projectApi.projectId
      }).then((data) => {
        if (data.code === 200) {
          this.projectLog.list = data.data.list
          this.projectLog.total = data.data.total
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 获取项目组邀请外链
    getGroupShareKey () {
      let loading = this.lseutil.loading('正在生成')
      this.lseajax.post(this.lseajax.baseurl + '/api/groups/getGroupShareKey', {
        group: this.groupInfoProject.groupId
      }).then((data) => {
        if (data.code === 200) {
          let url = 'http://api.lseanime.com/index.html#/group?key=' + data.data
          this.lseutil.alert('点击复制链接发送至你的好友用于快速加入项目组：' + url, {
            okText: '复制',
            title: '项目组分享外链',
            type: 'success',
            onOk: function () {
              let doc = document.createElement('input')
              doc.setAttribute('value', url)
              document.body.appendChild(doc)
              doc.select()
              document.execCommand('Copy')
              document.body.removeChild(doc)
              this.lseutil.msg({
                msg: '复制成功'
              })
            }
          })
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 读取该项目内API创建者用户列表
    getApiCreateList (pageNo) {
      // let loading = this.lseutil.loading('正在读取项目内用户信息')
      this.filterApi.loadingFlag = true
      this.filterApi.createPageNo = pageNo
      this.lseajax.post(this.lseajax.baseurl + '/api/projectApi/getApiCreateList', {
        pageSize: this.pageSize,
        pageNo: pageNo,
        project: this.projectApi.projectId
      }).then((data) => {
        if (data.code === 200) {
          this.filterApi.create = data.data.list
          this.filterApi.createTotal = data.data.total
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        this.filterApi.loadingFlag = false
      }).catch(res => {
        this.filterApi.loadingFlag = false
      })
    },
    // 筛选API 用户选中与method选中动态change
    filterApiChangeConditions (type, name) {
      if (type === 'create') {
        let index = this.filterApi.selectCreate.findIndex(item => item === name)
        if (index === -1) {
          this.filterApi.selectCreate.push(name)
        } else {
          this.filterApi.selectCreate.splice(index, 1)
        }
      }
      if (type === 'method') {
        let index = this.filterApi.selectMethod.findIndex(item => item === name)
        if (index === -1) {
          this.filterApi.selectMethod.push(name)
        } else {
          this.filterApi.selectMethod.splice(index, 1)
        }
      }
    },
    // 筛选API
    filterApiList (pageNo) {
      this.isApiListOrFilter = false
      this.projectApi.pageNo = pageNo
      let loading = this.lseutil.loading('正在筛选接口列表')
      this.lseajax.post(this.lseajax.baseurl + '/api/projectApi/filterApi', {
        pageSize: this.pageSize,
        pageNo: pageNo,
        project: this.projectApi.projectId,
        name: this.filterApi.name,
        method: this.filterApi.selectMethod,
        create: this.filterApi.selectCreate
      }, true, 'brackets').then((data) => {
        if (data.code === 200) {
          this.projectApi.list = data.data.list
          this.projectApi.total = data.data.total
        } else {
          this.lseutil.msg({
            msg: data.msg
          })
        }
        loading.close()
      }).catch(res => {
        loading.close()
      })
    },
    // 项目内API列表分类读取
    getProjectApiSelect (pageNo) {
      this.isApiListOrFilter ? this.getProjectApiList(pageNo) : this.filterApiList(pageNo)
    },
    // 打开调试
    openInterfaceOnLine () {
      this.interfaceOnline.apiInfo = {}
      this.interfaceOnline.flag = true
      this.interfaceOnline.projectId = this.projectApi.projectId
    },
    timestampToTime (timestamp) {
      // 时间戳为10位需*1000，时间戳为13位的话不需乘1000
      let date = new Date(timestamp)
      let Y = date.getFullYear() + '-'
      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
      let D = date.getDate() + ' '
      let h = date.getHours() + ':'
      let m = date.getMinutes() + ':'
      let s = date.getSeconds()
      return Y + M + D + h + m + s
    },
    getYear () {
      let date = new Date()
      return date.getFullYear()
    }
  },
  created () {
    let width = document.body.clientWidth
    if (width >= 1366) {
      this.waterfallCol = 5
    } else if (width > 768) {
      this.waterfallCol = 4
    } else if (width <= 768) {
      this.waterfallCol = 2
    }
    if (width <= 768) {
      this.isXs = true
    } else {
      this.isXs = false
    }
    // 判定是否有登录状态
    if (this.token) {
      this.getUserInfo()
      this.getProjectList(1)
    } else {
      this.lseutil.msg({
        msg: '您当前未登录,无法进入LSE'
      })
      this.lseutil.go('login')
    }
  },
  mounted () {
    // eslint-disable-next-line no-eval
    // let first = eval(this.lseajax.storageJson.get('lseguide'))
    // if (first === null || first === undefined || first === true) {
    //   if (this.token) {
    //     guide.start()
    //   }
    // }
  }
}
</script>

<style scoped>
>>>.el-avatar img{
  margin: auto
}
>>>.el-scrollbar__wrap{
  overflow-x: hidden;
}
>>>.el-drawer__body{
  overflow: auto;
}
>>>.vue-waterfall.is-transition img{
  opacity: 1;
}
.waterfall-item {
    width: calc(100% - 20px);
    margin: 10px;
    box-sizing: border-box;
}
.waterfall-item img, .waterfall-item video {
    width: 100%;
}
.waterfall-item-tag{
    overflow: auto;
    word-break: normal;
}
.text {
    font-size: 12px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both
}
.time {
  font-size: 13px;
  color: #999;
}
.tips {
  font-size: 12px;
  color: #999;
}
>>>.ivu-message{
  z-index: 999999 !important;
}
>>>.ivu-modal-confirm-body{
  word-break: break-all
}
>>>.el-scrollbar__view{
  height: 100%;
}
.ivu-col {
  height: 100%;
}
/* tab iview 自定义样式 */
>>> .ivu-tabs.ivu-tabs-card > .ivu-tabs-bar .ivu-tabs-tab{
        border-radius: 0;
        background: #fff;
}
>>> .ivu-tabs.ivu-tabs-card > .ivu-tabs-bar .ivu-tabs-tab-active{
    border-top: 1px solid #3399ff;
}
>>> .ivu-tabs.ivu-tabs-card > .ivu-tabs-bar .ivu-tabs-tab-active:before{
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background: #3399ff;
    position: absolute;
    top: 0;
    left: 0;
}
/* 移动端 */
#lse_api_mobile_menu{
  position: fixed;
  bottom: 20px;
  right: 15px;
  z-index: 9999;
  display: none;
}

@media all and (max-width: 960px) {
  #lse_api_mobile_menu{
    display: block;
  }
  #lse_api_pc_menu{
    display: none;
  }
}
</style>
